<!--导入按钮-->
<template>
  <div class="Export el-card is-always-shadow el-card__body">
    <el-upload
      class="upload-demo"
      action="check/cleardiff/saveDiffBatchList"
      :headers="headers"
      :with-credentials="true"
      :on-success="uploadSuccess"
    >
      <el-button size="mini" type="primary">导入</el-button>
    </el-upload>
    <el-dialog
      title="导入预览"
      :visible.sync="dialogVisible"
      width="80%"
      height="60%"
    >
      <avue-crud
        ref="crud"
        :option="option"
        :data="list"
      >

      </avue-crud>

      <span slot="footer" class="dialog-footer">
    <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
    <el-button size="mini" type="primary" @click="exportData">导入</el-button>
  </span>
    </el-dialog>
  </div>
</template>


<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import ExportJsonExcel from "js-export-excel";
  import {
    saveDiffBatch,
  } from "../../../api/subwayRat/cleardiff/cleardiff";
  export default {
    components: {},
    data() {
      return {
        headers: {},
        dialogVisible: false,
        list: [],
        option: {}
      }
    },
    created() {
    },
    methods: {
      getAuth(){
        const token = this.$store.getters.access_token;
        if (token) {
          this.headers['Authorization'] = 'Bearer ' + token// token
        }
      },
      uploadSuccess(response, file, fileList){
        this.list = response.data;
        this.dialogVisible = true;
        this.getOption();
      },
      exportData(){
        saveDiffBatch(JSON.stringify(this.list)).then(res => {
          if (res.data.code == 0) {
            this.$message.success("操作成功！");
            this.dialogVisible = false;
            this.$parent.$parent.$parent.$parent.$parent.getList();
          } else {
            this.$message.error(res.data.msg);
          }
        })
      },
      getOption(){
        this.option = {
          height: 'auto',
          columnBtn: false,
          selection: false,
          refreshBtn: false,
          menu: false,
          emptyBtn: false,
          border: true,
          index: true,
          indexLabel: '序号',
          selection: false,
          reserveSelection: true,
          stripe: true,
          menuAlign: 'center',
          editBtn: false,
          delBtn: false,
          align: 'center',
          addBtn: false,

          column: [{
            label: '主键',
            prop: 'id',
          }, {
            label: '差异原因',
            prop: 'diffReason',
          }, {
            label: '差异回复日期',
            prop: 'diffReasonTime',
            type:'datetime',
            format: 'yyyy-MM-dd',
            valueFormat: 'yyyy-MM-dd',
          }]
        }

      }
    },
    mounted() {
      this.getAuth();
    }
  }
</script>
<style lang="scss">
  .Export {
    display: inline-flex;
    .el-upload-list {
      display: none;
    }
  }

</style>
